import { createRouter, createWebHashHistory } from 'vue-router'
import nProgress from 'nprogress'
import 'nprogress/nprogress.css'
import HomePage from '../views/Home.vue'
import BlogPage from '@/views/Blog.vue'
import ProjectPage from '@/views/Project.vue'
import BlogDisplay from '@/views/BlogDisplay.vue'

const routes = [
  {
    path: '/',
    name: 'home',
    component: HomePage
  },
  {
    path: '/blog',
    name: 'blog',
    component: BlogPage
  },
  {
    path:'/blog/:id',
    name:'blog-display',
    component:BlogDisplay
  },
  {
    path: '/project',
    name: 'project',
    component: ProjectPage
  }
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

router.beforeEach((to,from,next)=>{
  nProgress.start()
  next()
})
router.afterEach((to,from,next)=> {
  nProgress.done()
  
})

export default router
